<template>
	<view class="page" style="padding-bottom: 50upx;">
		<!-- @click="$u.route({url:'/pagesB/personalSon/Setup',params:{avatar:getuserInfo.headimgurl}})" -->
		<!--    <div class="avatarHead u-rela u-flex u-p-30" >
      <u-avatar :src="getuserInfo.headimgurl" class="u-m-r-20" size="large"></u-avatar>
      <div>
        <h3 class="title">{{getuserInfo.user_name}}</h3>
        <p  class="phone">{{getuserInfo.phone|| ''}}</p>
      </div>
    </div> -->
		<u-cell-group>
			<u-cell-item title="地址管理" @click="navigateTo('/pagesB/personalSon/address')"></u-cell-item>

		</u-cell-group>

		<u-cell-group class="u-m-t-20">
			<u-cell-item title="修改登录密码" @click="navigateTo('/pagesB/setting/modify')"></u-cell-item>
			<u-cell-item title="修改手机号码" @click="toshouji"></u-cell-item>
			<u-cell-item title="清除缓存" @click="clearStorage()" :value="currentSize+'M'"></u-cell-item>

		</u-cell-group>

		<!--   <u-cell-group class="u-m-t-20">
      <u-cell-item  title="多语言" @click="navigateTo('/pagesB/setting/switchLang')" ></u-cell-item>
    </u-cell-group> -->

		<u-cell-group class="u-m-t-20">
			<u-cell-item title="功能反馈" @click="$u.route('/pagesB/personalSon/Application')"></u-cell-item>
			<u-cell-item title="帮助" @click="showPopUpBox()"></u-cell-item>
			<u-cell-item :title="item.ar_title" @click="goAboutus(item.id,item.ar_title)" v-for="item in zclist">
			</u-cell-item>
			<u-cell-item title="隐私设置" @click="ysset"></u-cell-item>
			<u-cell-item title="注销账号" @click="xao()" v-if="myinfo.shop_id==0"></u-cell-item>

		</u-cell-group>
		<div class="logoutBtn" @click="logout">退出登录</div>
		<view class="popUpBox" v-if="showBox == 1">
			<view class="tel">
				<image :src="cosUrl+'images/tel.png'"></image>
			</view>
			<view class="text f30 c3" style="margin-top: 33upx;"> 客服热线</view>
			<view class="text f30 c3">{{serviceHotline}}</view>
			<view class="button" @click="dail(serviceHotline)">拨打电话</view>
			<view class="cancel" @click="hideMask()">
				<u-icon name="close-circle" color="#eee" size="48"></u-icon>
			</view>
		</view>
	</view>
</template>

<script>
	const webSocket = require("../../utils/socket.js");
	export default {
		data() {
			return {
				currentSize: 0, //当前缓存大小
				Server: '',
				zclist: [],
				showBox: 0,
				serviceHotline: '',
				myinfo:{}
			};
		},

		computed: {
			getuserInfo() {
				return this.$store.getters.getuserInfo
			}
		},
		onLoad() {
			try {
				const value = uni.getStorageSync('userInfo');
				if (value) {
					this.myinfo = JSON.parse(value)
					console.log(this.myinfo,"是实打实大声道")
				} else {
					// alert(222)
				}
			} catch (e) {
				// error
			}
			uni.setNavigationBarTitle({
				title: '设置'
			});
			this.getServiceHotline();
			uni.request({
				url: 'https://dsx.cdzer.com/api/Article/get_newlist', //仅为示例，并非真实接口地址。
				method: 'POST',
				header: {
					'content-type': 'application/x-www-form-urlencoded',
				},
				success: (res) => {
					console.log(res, "政策列表")
					this.zclist = res.data.data
				}
			});
		},
		onShow() {
			this.getStorageInfoSync();
		},
		methods: {
			toshouji(){
				uni.navigateTo({
					url:'../setphone'
				})
			},
			ysset() {
				uni.navigateTo({
					url: '../yinsiset'
				})
			},
			xao() {
				uni.navigateTo({
					url: '../xaohao'
				})
			},
			hideMask() {
				this.showBox = 0;
			},
			dail(tel) {
				uni.makePhoneCall({
					phoneNumber: tel
				})

			},
			getServiceHotline() {
				this.$http.getserviceHotline().then(res => {
					if (res.status == 200) {
						this.serviceHotline = res.data.serviceHotline;

					}
				})
			},
			showPopUpBox() {
				this.showBox = 1;
			},
			navigateTo(url) {
				this.$navigateTo(url);
			},

			// 退出登陆
			logout() {
				$utils.showModal({
					content: '确认退出账户吗?'
				}).then(res => {
					console.log("-> res", res);
					if (res.confirm) {
						uni.onSocketClose(function(res) {
							console.log('WebSocket 已关闭！');
						});
						uni.removeStorageSync('token');
						uni.removeStorageSync('device_token');
						uni.removeStorageSync('userInfo')
						this.$toast('退出登录成功');

						this.$u.route({
							url: "/pagesB/login/login",
							type: "reLaunch"
						})

					}
				})

			},
			// 获取缓存大小
			getStorageInfoSync() {
				uni.getStorageInfo({
					success: res => {
						this.currentSize = (res.currentSize / 1024).toFixed(2);
					}
				});
			},
			goAboutus(id, title) {
				// this.$u.route({url:'/pagesB/article/detail',params:{title:'关于我们'}{id:id}})
				uni.navigateTo({
					url: `/pagesB/article/detail?tilte=${title}&id=${id}`
				})
			},
			// 清除缓存
			clearStorage() {
				$utils.showModal({
					content: '确定要清除缓存吗?'
				}).then(res => {
					if (res.confirm) {
						try {
							uni.clearStorageSync();
							this.currentSize = 0
						} catch (e) {
							// error
						}
					}
				})

			}
		}
	};
</script>

<style lang="scss" scoped>
	.popUpBox {
		position: fixed;
		width: 402upx;
		height: 452upx;
		background: #fff;
		z-index: 999;
		border-radius: 20upx;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);

		.tel {
			text-align: center;
			margin-top: -25upx;

			image {
				width: 174upx;
				height: 174upx;
			}
		}

		.text {
			line-height: 43upx;
			font-weight: bold;
			text-align: center;
		}

		.button {
			width: 247upx;
			height: 66upx;
			border-radius: 45upx;
			position: absolute;
			bottom: 36upx;
			left: 50%;
			transform: translate(-50%, 0)
		}

		.cancel {
			width: 53upx;
			height: 53upx;
			position: absolute;
			left: 50%;
			transform: translate(-50%, 0);
			bottom: -75upx;

			image {
				width: 100%;
				height: 100%;
			}
		}
	}

	@import "~uview-ui/index.scss";

	.logoutBtn {
		padding: 20upx;
		background-color: #fff;
		margin-top: 40upx;
		text-align: center;
		color: #666;
	}

	.title {
		font-size: 32upx;
		margin-bottom: 10upx;
	}

	.phone {
		font-size: 24upx;
		color: #999;
	}

	.avatarHead {
		background-color: #fff;
		border-bottom: 1px solid #f5f5f5;

		.right {
			position: absolute;
			right: 30upx;
			top: 50%;
			transform: translateY(-50%);
		}
	}
</style>
